<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Base</title>
</head>
<body>
    <button onclick="testGet()">GET请求 查</button>
    <button onclick="testPost()">POST请求 增</button>
    <button onclick="testPut()">PUT请求 改</button>
    <button onclick="testDelete()">DELETE请求 删</button><br/>
    <div id="result"></div>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.20.0/axios.js"></script>
    <script>
        const resutl = document.getElementById('result');

        function testGet(params){
            axios({
                url:'http://localhost:9001/posts',
                params: {
                    id: 1
                }
            }).then(response => {
                console.log(response);
                resutl.innerText = JSON.stringify(response.data);
            });
        }
        function testPost(params){
            axios(
                {
                    url: 'http://localhost:9001/posts',
                    method: 'post',
                    data: {
                        title:"json-server3-base", author:"typicode3-base"
                    }
                }
            ).then(response => {
                console.log(response);
                resutl.innerText = JSON.stringify(response.data);
            });
        }
        function testPut(params){
            axios({
                url: 'http://localhost:9001/posts/9',
                method : 'put',
                data:{
                    "title":"json-server------", "author":"typicode4-base"
                }
            }).then(response => {
                console.log(response);
                resutl.innerText = JSON.stringify(response.data);
            });
        }
        function testDelete(params){
            axios({
                url:'http://localhost:9001/posts/9',
                method:'delete'

            }).then(response => {
                console.log(response);
                resutl.innerText = JSON.stringify(response.data);
            });
        }
    </script>

</body>
</html>